<template>
    <div class="flooPage">
        <div class="hosSerach">
            <img src="@/assets/img/search.png" alt="" class="hosSerach_img1 hosSerach_img">
            <input type="text" placeholder="请输入科室名" v-model="searchValue" @input="inputSearch">
            <img src="@/assets/img/delete@2x.png" alt="" class="hosSerach_img2 hosSerach_img"
                v-if="searchValue.length > 0" @click="searchValue = ''">
        </div>
        <div class="flooMain">
            <div class="flooMain_item" v-for="item in floorList2" v-show="searchValue.length > 0">
                <div class="flooMain_item_tit">{{ item.name }}</div>
                <div class="flooMain_item_children">
                    <div class="flooMain_item_children_item" v-for="i in item.children"
                        @click="goBack(item.name, i.ffValue)">{{ i.ffname }}
                    </div>
                </div>
            </div>
            <div class="flooMain_item" v-for="item in floorList" v-show="searchValue.length == 0">
                <div class="flooMain_item_tit">{{ item.name }}</div>
                <div class="flooMain_item_children">
                    <div class="flooMain_item_children_item" v-for="i in item.children"
                        @click="goBack(item.name, i.ffValue)">{{ i.ffname }}
                    </div>
                </div>
            </div>

        </div>

    </div>
</template>
<script>
export default {
    data() {
        return {
            searchValue: "",
            floorList2: [],
            floorList: [
                {
                    name: "1F",
                    id: "1F",
                    children: [

                        {
                            ffname: "挂号处/住院处",
                            ffnav: "东门进入后左前方直走，然后右转转",
                            ffValue: 1,
                        },
                        {
                            ffname: "综合急诊黏膜病科①诊室",
                            ffnav: "东门进入后左前方直走",
                            ffValue: 2,
                        },
                        {
                            ffname: "综合急诊黏膜病科②诊室",
                            ffnav: "东门进入后左前方直走",
                            ffValue: 3,
                        },
                        {
                            ffname: "放射科",
                            ffnav: "西侧电梯左转后右转/东侧电梯右后方穿过大厅",
                            ffValue: 4,
                        },
                        {
                            ffname: "药局",
                            ffnav: "东侧电梯左转/西侧电梯右转穿过大厅后左转",
                            ffValue: 5,
                        },
                        {
                            ffname: "检验科",
                            ffnav: "东侧电梯左转/西侧电梯右转穿过大厅后左转",
                            ffValue: 6,
                        },
                    ]
                },
                {
                    name: "2F",
                    id: "2F",
                    children: [

                        {
                            ffname: "牙体牙髓病科①诊室",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 1,
                        },
                        {
                            ffname: "牙体牙髓病科②诊室",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 2,
                        },
                        {
                            ffname: "牙体牙髓病科③诊室",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 3,
                        },
                        {
                            ffname: "牙体牙髓病科④诊室",
                            ffnav: "西侧电梯左后方/东侧电梯右后方直走，至走廊尽头",
                            ffValue: 4,
                        },
                        {
                            ffname: "牙体牙髓病科⑤诊室",
                            ffnav: "西侧电梯左侧/东侧电梯右后方直走，至走廊尽头",
                            ffValue: 5,
                        },
                        {
                            ffname: "牙体牙髓病科⑥诊室",
                            ffnav: "西侧电梯左前方/东侧电梯右后方直走，至走廊尽头后右转",
                            ffValue: 6,
                        },
                        {
                            ffname: "牙体牙髓病科⑦诊室",
                            ffnav: "西侧电梯左前方/东侧电梯右后方直走，至走廊尽头后右转",
                            ffValue: 7,
                        },
                        {
                            ffname: "牙周病科①诊室",
                            ffnav: "东侧电梯右后方直走/西侧电梯右前方",
                            ffValue: 8,
                        },
                        {
                            ffname: "牙周病科②诊室",
                            ffnav: "东侧电梯右后方直走/西侧电梯右前方",
                            ffValue: 9,
                        },
                        {
                            ffname: "牙周病科③诊室",
                            ffnav: "东侧电梯左前方/西侧电梯右前方直走",
                            ffValue: 10,
                        },
                        {
                            ffname: "牙周病科④诊室",
                            ffnav: "东侧电梯左后方/西侧电梯右前方直走，至走廊尽头后左转",
                            ffValue: 11,
                        },
                        {
                            ffname: "牙周病科⑤诊室",
                            ffnav: "东侧电梯左后方/西侧电梯右前方直走，至走廊尽头后左转",
                            ffValue: 12,
                        }
                    ]
                },
                {
                    name: "3F",
                    id: "3F",
                    children: [

                        {
                            ffname: "正畸一科①诊室",
                            ffnav: "西侧电梯左后方/东侧电梯右后方直走，至走廊尽头",
                            ffValue: 1,
                        },
                        {
                            ffname: "正畸一科②诊室",
                            ffnav: "西侧电梯左后方/东侧电梯右后方直走，至走廊尽头",
                            ffValue: 2,
                        },
                        {
                            ffname: "正畸一科③诊室",
                            ffnav: "西侧电梯左前方/东侧电梯右后方直走，至走廊尽头后右转",
                            ffValue: 3,
                        },
                        {
                            ffname: "正畸一科④诊室",
                            ffnav: "西侧电梯左前方/东侧电梯右后方直走，至走廊尽头后右转",
                            ffValue: 4,
                        },
                        {
                            ffname: "修复一科①诊室",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 5,
                        },
                        {
                            ffname: "修复一科②诊室",
                            ffnav: "西侧电梯右后方直走/东侧电梯右后方直走",
                            ffValue: 6,
                        },
                        {
                            ffname: "修复一科③诊室",
                            ffnav: "西侧电梯右后方直走/东侧电梯右后方直走",
                            ffValue: 7,
                        },
                        {
                            ffname: "修复二科①诊室",
                            ffnav: "东侧电梯右前方/西侧电梯右后方直走，至走廊尽头后右转",
                            ffValue: 8,
                        },
                        {
                            ffname: "修复二科②诊室",
                            ffnav: "东侧电梯前方/西侧电梯右后方直走，至走廊尽头",
                            ffValue: 9,
                        },
                        {
                            ffname: "修复二科③诊室",
                            ffnav: "东侧电梯左方/西侧电梯右后方直走，至走廊尽头后左转",
                            ffValue: 10,
                        },
                    ]
                },
                {
                    name: "4F",
                    id: "4F",
                    children: [

                        {
                            ffname: "干诊科①诊室",
                            ffnav: "西侧电梯左后方/东侧电梯右后方直走，至西侧电梯",
                            ffValue: 1,
                        },
                        {
                            ffname: "干诊科②诊室",
                            ffnav: "西侧电梯左后方/东侧电梯右后方直走，至西侧电梯",
                            ffValue: 2,
                        },
                        {
                            ffname: "干诊科③诊室",
                            ffnav: "西侧电梯左前方/东侧电梯右后方直走，至西侧电梯",
                            ffValue: 3,
                        },
                        {
                            ffname: "干诊科④诊室",
                            ffnav: "西侧电梯左前方/东侧电梯右后方直走，至西侧电梯",
                            ffValue: 4,
                        },
                        {
                            ffname: "心电图室",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 5,
                        },
                        {
                            ffname: "采血室",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 6,
                        },
                        {
                            ffname: "口腔头颈肿瘤治疗中心",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 7,
                        },
                        {
                            ffname: "口腔颌面外科门诊①诊室",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 8,
                        },
                        {
                            ffname: "口腔颌面外科门诊②诊室",
                            ffnav: "西侧电梯右后方/东侧电梯右后方直走",
                            ffValue: 9,
                        },
                        {
                            ffname: "口腔颌面外科门诊③诊室",
                            ffnav: "东侧电梯右后方/西侧电梯右后方直走",
                            ffValue: 10,
                        },
                        {
                            ffname: "口腔颌面外科门诊④诊室",
                            ffnav: "东侧电梯右后方/西侧电梯右后方直走",
                            ffValue: 11,
                        },
                        {
                            ffname: "儿童口腔科①诊室",
                            ffnav: "东侧电梯右前方/西侧电梯右后方直走，至走廊尽头后左转",
                            ffValue: 12,
                        },
                        {
                            ffname: "儿童口腔科②诊室",
                            ffnav: "东侧电梯右前方/西侧电梯右后方直走，至走廊尽头后左转",
                            ffValue: 13,
                        },
                        {
                            ffname: "儿童口腔科③诊室",
                            ffnav: "东侧电梯右前方/西侧电梯右后方直走，至走廊尽头后左转",
                            ffValue: 14,
                        },
                        {
                            ffname: "儿童口腔科④诊室",
                            ffnav: "东侧电梯右前方/西侧电梯右后方直走，至走廊尽头后左转",
                            ffValue: 15,
                        },
                    ]
                },
                {
                    name: "5F",
                    id: "5F",
                    children: [

                        {
                            ffname: "颌面外科病房护士站",
                            ffnav: "（仅）西侧电梯左转",
                            ffValue: 1,
                        },
                        {
                            ffname: "正畸二科①诊室",
                            ffnav: "（仅）东侧电梯左转",
                            ffValue: 2,
                        },
                        {
                            ffname: "正畸二科②诊室",
                            ffnav: "（仅）东侧电梯左后方",
                            ffValue: 3,
                        },
                        {
                            ffname: "正畸二科③诊室",
                            ffnav: "（仅）东侧电梯左后方",
                            ffValue: 4,
                        },
                    ]
                },
                {
                    name: "6F",
                    id: "6F",
                    children: [

                        {
                            ffname: "门诊手术室",
                            ffnav: "西侧电梯右转",
                            ffValue: 1,
                        },
                        {
                            ffname: "头颈外科病房护士站",
                            ffnav: "西侧电梯左转",
                            ffValue: 2,
                        },
                    ]
                },
                {
                    name: "7F",
                    id: "7F",
                    children: [

                        {
                            ffname: "综合科",
                            ffnav: "东侧电梯左转/西侧电梯左后方",
                            ffValue: 1,
                        },
                        {
                            ffname: "医保办",
                            ffnav: "东侧电梯右转穿过走廊/西侧电梯左转",
                            ffValue: 2,
                        },
                        {
                            ffname: "医务部",
                            ffnav: "东侧电梯右转穿过走廊/西侧电梯左转",
                            ffValue: 3,
                        },
                    ]
                },
                {
                    name: "8F",
                    id: "8F",
                    children: [

                        {
                            ffname: "预防科",
                            ffnav: "西侧电梯右转",
                            ffValue: 1,
                        },
                        {
                            ffname: "病案室",
                            ffnav: "西侧电梯右前方",
                            ffValue: 2,
                        },
                        {
                            ffname: "舒适化治疗中心",
                            ffnav: "西侧电梯左转",
                            ffValue: 3,
                        },
                        {
                            ffname: "麻醉复苏室PACU",
                            ffnav: "东侧电梯左转",
                            ffValue: 4,
                        },
                        {
                            ffname: "手术室",
                            ffnav: "西侧电梯左后方",
                            ffValue: 5,
                        },
                    ]
                },
                {
                    name: "9F",
                    id: "9F",
                    children: [
                        {
                            ffname: "病理科",
                            ffnav: "（仅）东侧电梯左侧有窗口",
                            ffValue: 1,
                        },
                        {
                            ffname: "种植中心①诊室",
                            ffnav: "（仅）西侧电梯左前方",
                            ffValue: 2,
                        },
                        {
                            ffname: "种植中心②诊室",
                            ffnav: "（仅）西侧电梯右前方",
                            ffValue: 3,
                        },
                        {
                            ffname: "种植中心③诊室",
                            ffnav: "（仅）西侧电梯右转",
                            ffValue: 4,
                        },
                        {
                            ffname: "种植中心④诊室",
                            ffnav: "（仅）西侧电梯右转",
                            ffValue: 5,
                        },
                    ]
                }
            ]
        }
    },
    methods: {
        inputSearch() {
            var arr = []
            for (let index1 = 0; index1 < this.floorList.length; index1++) {
                for (let index2 = 0; index2 < this.floorList[index1].children.length; index2++) {
                    if (this.floorList[index1].children[index2].ffname.indexOf(this.searchValue) != -1) {
                        arr.push({
                            name: this.floorList[index1].name,
                            id: this.floorList[index1].id,
                            children: []
                        })
                        break
                    }
                }
            }
            for (let index1 = 0; index1 < this.floorList.length; index1++) {
                for (let index2 = 0; index2 < this.floorList[index1].children.length; index2++) {
                    if (this.floorList[index1].children[index2].ffname.indexOf(this.searchValue) != -1) {
                        for (let index3 = 0; index3 < arr.length; index3++) {
                            if (arr[index3].name == this.floorList[index1].name) {
                                arr[index3].children.push(this.floorList[index1].children[index2])
                            }
                        }
                    }
                }
            }
            this.floorList2 = arr
        },
        goBack(name, ffValue) {
            window.localStorage.setItem("ffValue", ffValue)
            window.localStorage.setItem("floorName", name)
            this.$router.go(-1)
        },
    },
}
</script>
<style scoped>
.flooPage {
    height: 100vh;
    overflow-y: scroll;
    background-color: #F2F5F8;

}

.hosSerach {
    width: calc(100% - 2rem);
    height: 3.125rem;
    padding: 0 1rem;
    display: flex;
    align-items: center;
    position: relative;

}

.hosSerach input {
    width: 100%;
    background: #FFFFFF;
    border-radius: 1.125rem;
    height: 2.1875rem;
    background-color: #fff;
    padding: 0 2.1875rem;
    border: none;
    outline: none;
    font-size: 0.8125rem;
}

.hosSerach_img {
    width: 1.0625rem;
    height: 1.0625rem;
    position: absolute;
    top: 1.0625rem;
}

.hosSerach_img1 {

    left: 1.75rem;
}

.hosSerach_img2 {

    right: 1.75rem;
}

.flooMain {
    padding: 1rem;
}

.flooMain_item_tit {
    font-size: 1.44rem;
    font-family: PingFang SC;
    font-weight: 500;
    color: #448EFF;
    line-height: 2.8125rem;
    color: #448EFF;

}

.flooMain_item_children {
    display: flex;
    align-items: center;
    /* justify-content: space-between; */
    flex-wrap: wrap;
}

.flooMain_item_children_item {
    height: 2.375rem;
    line-height: 2.375rem;
    background: #FFFFFF;
    border-radius: 0.375rem;
    padding: 0 0.9375rem;
    background: #FFFFFF;
    border-radius: 0.375rem;
    margin-bottom: 0.75rem;
    margin-right: 0.625rem;
    font-size: 0.94rem;
    font-family: PingFang SC;
    font-weight: 500;
    color: #3F4551;

}
</style>